<template>
  <div id="appBody">
    <topMenu v-show="isToken"></topMenu>
    <div :class="['routerWindow',{'routeractive':!isToken}]" ref="routerWindow" >
        <leftMenu2 v-show="isToken"></leftMenu2>
        <router-view class="router"></router-view>
       <!-- 修改密码 -->
       <el-dialog width="400px" draggable  title="修改密码" :close-on-click-modal='false'
                    v-model="changePassword">
                    <div class="choicedio">
                        <div class="mydiodiv222" >
                            <span class="dioleftname dioleftname1">旧密码：</span> <el-input v-model="oldpassword" show-password />
                        </div>
                        <div class="mydiodiv222" style="margin-top:12px">
                            <span class="dioleftname dioleftname1">新密码：</span> <el-input v-model="newpassword" show-password />
                        </div>
                        <div class="mydiodiv222" style="margin-top:12px">
                            <span class="dioleftname dioleftname1">确认新密码：</span> <el-input v-model="newpassword2" show-password />
                        </div>
                      
                    </div>
                    <template #footer>
                          <div  class="dialog-footer">
                            <el-button  @click="changePassword = false" >取 消</el-button>
                            <el-button  class="last-el-button" @click="deviceTempFN" type="primary">确 定</el-button>
                            </div>
                    </template>
                    
                    <div class="el-loading-mask" v-show="diaisMask">
                        <div class="el-loading-spinner"><svg viewBox="25 25 50 50" class="circular"> <circle cx="50" cy="50" r="20" fill="none" class="path"></circle></svg></div>
                    </div>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import { useCounterStore } from './stores/counter'
import topMenu from './components/module/menu/topMenu.vue'
import leftMenu2 from './components/module/menu/leftMenu2.vue'
import cloudLeftMenu from './components/module/menu/cloudLeftMenu.vue'
import {scanProtocol_manage,commondatatype,changePasswd} from "./api/Interface";
import {getReadDeviceTree,getUnitTree,login} from "./api/abbNewApi";
export default {
   components:{
     topMenu,
     leftMenu2,
     cloudLeftMenu
   },
   data(){
    return {
        diaisMask:false,
        changePassword:false,
        oldpassword:"",
        newpassword:"",
        newpassword2:"",
        hideLeft: false,
        menuSeparated: false,
        menuArr:[],
        nowMenu: [],
        nowSkinFlag: true,
        isToken:false,
    }
   },
   computed:{
    appwhetherLogin(){
       return useCounterStore().whetherLogin
    },
    eidtPassword(){
       return useCounterStore().eidtPasswordval
    },
   },
   watch:{
    appwhetherLogin(val){
          this.isToken = val
          if(val){
           this.$router.push('/gatewayInfo')
            //扫描协议库
            scanProtocol_manage().then(res => {
              //  console.log("扫描协议库",res);
            })
            //数据类型
            commondatatype().then(res => {
              // console.log("数据类型",res);
              if(res.code == 200){
                useCounterStore().setDataType(res.data)
              }
            })
          }else {
            this.$router.push('/login')
          }
    },
    eidtPassword(val){
        if(val){
         this.oldpassword = ""
         this.newpassword = ""
         this.newpassword2 = ""
         this.changePassword = true
        }
    },
    changePassword(val){
          if(!val){
              this.changePassword = false
               useCounterStore().setmima(false)
          }
      },
   },
   mounted(){
       if(localStorage.getItem('token')){
         useCounterStore().setwhetherLogin(true)
        // this.$store.menuStore.commit('setwhetherLogin',true)
         this.isToken = true
         //webserve的第一个页面
         this.$router.push('/gatewayInfo')
        
         //云端管理机的第一个页面
        //  this.$router.push('/deviceInformation')
      }else {
        useCounterStore().setwhetherLogin(false)
        // this.$store.menuStore.commit('setwhetherLogin',false)
         this.isToken = false
         //webserve的登录页
         this.$router.push('/login')

         //云端管理机的登录页
        //  this.$router.push('/cloudLogin')
      }
      
   },
   methods: {
     //修改密码
      deviceTempFN(){
          if(this.oldpassword === this.newpassword){
             this.$message({showClose: true,message: '新密码不能与旧密码相同',type: 'warning'});
             return
          }
          if(this.newpassword2 != this.newpassword){
             this.$message({showClose: true,message: '两次新密码不一致',type: 'warning'});
             return
          }
          var dd = {
             'username':"admin",
             'old_password':this.oldpassword,
             'new_password':this.newpassword,
          }
          this.diaisMask = true
          changePasswd(dd).then(res => {
            // console.log("修改密码",res);
            this.diaisMask = false
            if(res == undefined){
               this.$message.error('修改失败')
            }
            if(res.code == 200){
               this.changePassword = false
               useCounterStore().setmima(false)
               this.$message({showClose: true,message: '修改成功，请重新登录',type: 'success'});
              localStorage.removeItem('token')
               useCounterStore().setwhetherLogin(false)
            }else {
                this.$message.error('修改失败')
            }

          })
      },
      fusionfn(){
        if(localStorage.getItem("token")){
            getReadDeviceTree().then(res => {
                if(res.code == 500 && res.message == '无法找到token对应用户！'){
                      localStorage.removeItem('token')
                      localStorage.removeItem('userDetailed')
                      localStorage.removeItem('nowWedoSystemUserCode')
                      var captcha="web:"+1234;

                       let formData = new FormData()
                        formData.append('userCode', 'admin');
                        formData.append('password', hex_md5("admin"));
                        formData.append('captcha', 'web:1234');
                        formData.append('loginType', 'Web');
                        formData.append('isStrongPassword', 0);
                        login(formData).then(res => {
                            if(res.success){
                                localStorage.setItem("nowWedoSystemUserCode", "admin");
                                localStorage.setItem("token", res.data.pkid);
                                localStorage.setItem("userDetailed", JSON.stringify(res.data));
                            } 
                        })
                    
                      
                }
                if(res.code != 200 && res.code != 500){
                    localStorage.removeItem('token')
                      localStorage.removeItem('userDetailed')
                      localStorage.removeItem('nowWedoSystemUserCode')
                      var captcha="web:"+1234;
                     let formData = new FormData()
                        formData.append('userCode', 'admin');
                        formData.append('password', hex_md5("admin"));
                        formData.append('captcha', 'web:1234');
                        formData.append('loginType', 'Web');
                        formData.append('isStrongPassword', 0);
                        login(formData).then(res => {
                            if(res.success){
                                localStorage.setItem("nowWedoSystemUserCode", "admin");
                                localStorage.setItem("token", res.data.pkid);
                                localStorage.setItem("userDetailed", JSON.stringify(res.data));
                            } 
                        })
                }
                if(res.code == 200){
                   useCounterStore().setUnit()
                }
            })
        }
        
      },
   }

}
</script>
<style scoped lang="scss">
.mydiodiv222 {
     display: flex;
     align-items: center;

     .dioleftname {
         white-space: nowrap;
         margin-right: 8px;
         color: #666666;
         font-size: 0.14rem;
     }
     .rightname {
         white-space: nowrap;
         color: #666666;
         margin-left:8px
     }
     .dioleftname1 {
        width: 72px;
        min-width: 72px;
        text-align: right;
     }
}
  .mybtns {
    position: absolute;
    top: 10%;
    right: 0;
    z-index: 99999;
    transition: 0.3s;

    &.mybtns-active {
      right: 20%;
    }
  }
 #appBody {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: hidden;
}
.routerWindow {
    position: relative;
    display: flex;
    align-content: center;
    width: 100%;
    height: calc(100% - 44px);
    justify-content: space-between;
  }
  .routeractive {
     height: 100% !important;
  }
.router {
    flex: 1;
    // height: calc(100% - 44px) !important;
    height: 100% !important;
    display: inline-block;
    overflow: auto;
    background-color: #f0f2f5;
    // background-color: #E6EEF5;
    transition: 0.35s;
    padding: 8px 10px 12px 8px !important;
    box-sizing: border-box;
    // z-index: 100;
  }

</style>
